<template>
	<view class="">
		<view class="edit-container">
			<form @submit="formSubmit" @reset="formReset">
				<label for="" v-if="flag=='nickName'">
					<view class="title">昵称：</view>
					<input type="text" :value="userInfo.nickname" name="nickname" placeholder="请输入昵称" maxlength="20" focus="true"
					 class="input-txt" />
				</label>
				<label for="" v-if="flag=='email'">
					<view class="title">邮箱：</view>
					<input type="text" :value="userInfo.email" name="email" placeholder="请输入邮箱" focus="true" class="input-txt" />
				</label>
				<label for="" v-if="flag=='mobile'">
					<view class="title">手机号：</view>
					<input type="text" :value="userInfo.mobile" name="mobile" placeholder="请输入手机号" focus="true" class="input-txt" />
				</label>
				<label for="" v-if="flag=='address'">
					<view class="title">地址：</view>
					<input type="text" :value="userInfo.address" name="address" placeholder="请输入地址" focus="true" class="input-txt" />
				</label>
				<label for="">
					<button form-type="submit" type="primary" class="btn">提交</button>
					<button type="primary" form-type="reset" class="btn">重置</button>
				</label>
			</form>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {},
				flag: ''
			}
		},
		onLoad(params) {
			this.flag = params.flag;
			var title = ';'
			switch (this.flag) {
				case 'nickName':
					title = '修改昵称';
					break;
				case 'email':
					title = '修改邮箱';
					break;
				case 'mobile':
					title = "修改手机";
					break;
				case 'address':
					title = "修改地址";
					break;
				default:
					break;
			}
			uni.setNavigationBarTitle({
				title: title
			});

		},
		onShow() {
			this.userInfo = uni.getStorageSync('gUserInfo');
			// 如果 this.userInfo为空，说明缓存里没有登陆信息，用户没有登陆，返回登陆页面
			if (this.userInfo.length <= 0) {
				uni.navigateTo({
					url: './login'
				})
				return;
			}
		},
		methods: {
			formSubmit(e) {
				var self = this;
				var editUserInfoUrl = this.requestUrl.editUserInfo;
				var params = e.detail.value;
				switch (this.flag) {
					case 'nickName':
						this.userInfo['nickname'] = params.nickname;
						break;
					case 'email':
						this.userInfo['email'] = params.email;
						break;
					case 'mobile':
						this.userInfo['mobile'] = params.mobile;
						break;
					case 'address':
						this.userInfo['address'] = params.address;
						break;
					default:
						break;
				}
				var editParams = {
					data: this.userInfo
				}
				this.util.request(editUserInfoUrl, 'post', function(res) {
					if (res.data.code == 0) {
						uni.setStorageSync("gUserInfo", self.userInfo);
						uni.showToast({
							title: res.data.msg,
							duration: 1500,
							success() {
								setTimeout(function() {
									uni.navigateBack({
										delta: 1,
									});
								}, 1500)
							}
						});
					} else {
						uni.showToast({
							title: res.data.msg,
							duration: 1500,
						});
					}

				}, editParams);
			}
		}
	}
</script>

<style scoped lang="scss">
	page {
		background: $uni-bg-color-grey;
	}

	.edit-container {
		padding: 30rpx 0;
	}

	.edit-container label {
		margin-bottom: 10rpx;
		overflow: hidden;
		float: left;
		width: 100%
	}

	.title {
		font-size: $uni-font-size-sm + 2upx;
		line-height: 60rpx;
		padding: 0 30rpx
	}

	.input-txt {
		background: $uni-bg-color;
		padding: 10rpx 30rpx;
		height: 76rpx;
	}

	.btn {
		margin: 20rpx 30rpx 0;
		background: $uni-bg-color-zhu;
	}
</style>
